import type { RouteHandle } from "@/types";
import { useEffect } from "react";
import { useMatches, type UIMatch } from "react-router-dom";

export default function TitleSetter() {
  const matches = useMatches() as UIMatch<any, RouteHandle>[];

  useEffect(() => {
    const currentTitle = [...matches].reverse().find((cur) => cur.handle?.title)
      ?.handle.title;
    if (currentTitle) document.title = currentTitle;
  }, [matches]);
  return null;
}
